﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Web Camera</title>
	<link rel="stylesheet" href="jquery/css/jquery.ui.all.css" />
	<link rel="stylesheet" href="css/common.css" />
	<script src="jquery/jquery-1.9.1.min.js"></script>
	<script src="jquery/jquery.ui.core.js"></script>
	<script src="jquery/jquery.ui.widget.js"></script>
	<script src="jquery/jquery.ui.mouse.js"></script>
	<script src="jquery/jquery.ui.slider.js"></script>
	<script src="jquery/json2.js"></script>
	<script src="js/common.js"></script>
	<script src="js/network.js"></script>
</head>
<script  type="text/javascript"> 
//语言包初始化
document.write(GetLanguagePathStr());
</script>
<style type="text/css">
.ConfigurationDiv{
	background:#1c1d22;
	left:0px;
	right:0px;
	height:665px;
}

.DivLable{
	text-align:left;
	line-height: 23px;
	font-family:arial;
	font-style:regular;
	font-size:16px;
	color:#ffffff;
	height:23px;
	cursor: pointer;
}


.DivInputAtLoacalRecord{
	width:280px;
	float:left;
}

.DivInputIpv4Param{
	width:50px;
	float:left;
}

#id_txtLocalrecordpath{
	width:160px;
	float:left;
}

.txtNetWork{
	width:160px;
	float:left;
}

</style> 



<body>   
<div class="ConfigurationDiv"  style="min-width:600px;">
	<div style="height:100%;margin:auto;width:600px;">	
		<div style="clear:both;height:15px;"></div>
		<div class="DivLable txtNetWork" id="id_txtNetWorkMaxConnection">Max connection:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_MaxConnection" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkDHCP">DHCP:</div>
		<div style="float:left"> 
		<div class="ClassContentSelect" id="id_Dhcp">Disable</div>
		<div class="DivContentSelectIco" id="id_Dhcp_selectico"></div>
		<div style="clear:both"></div>
		<div class="ClassContentSelectOption" name="id_Dhcp_option" style="margin-top:0px;" id="id_txtDisable">Disable</div>
		<div class="ClassContentSelectOption" name="id_Dhcp_option" style="margin-top:24px;" id="id_txtEnable">Enable</div>
		</div>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV4Address">IPV4 Address:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv4Address" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV4Subnet">IPV4 Subnet:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv4Subnet" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV4Gateway">IPV4 Gateway:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv4Gateway" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV4DNS1">IPV4 DNS1:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv4DNS1" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV4DNS2">IPV4 DNS2:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv4DNS2" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV4MacAddr">IPV4 MacAddr:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv4MacAddr" value="admin" readonly="readonly"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV6Address">IPV6 Address:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv6Address" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
			
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV6Gateway">IPV6 Gateway:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv6Gateway" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV6DNS1">IPV6 DNS1:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv6DNS1" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkIPV6DNS2">IPV6 DNS2:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_Ipv6DNS2" value="admin"></input>
		<div style="clear:both;height:15px;"></div>
		
	<!--	<div class="DivLable txtNetWork" id="id_txtNetWorkDatePort">Data Port:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_NetWorkDataPort" value="admin"></input>
		<div class="DivLable" style="float:left;margin-left:10px;">(1-65535)</div>	
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkMediaPort">Media Port:</div>
		<input class="DivInput DivInputAtLoacalRecord" id="id_NetWorkMediaPort" value="admin"></input>
		<div class="DivLable" style="float:left;margin-left:10px;">(1-65535)</div>	
		<div style="clear:both;height:15px;"></div> -->
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkHttpPort">Http Port:</div>
		<input class="DivInput DivInputAtLoacalRecord" maxlength="5" id="id_NetWorkHttpPort" value="80"></input>
		<div class="DivLable" style="float:left;margin-left:10px;">(1-65535)</div>	
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkOnvifPort">Onvif Port:</div>
		<input class="DivInput DivInputAtLoacalRecord" maxlength="5" id="id_NetWorkOnvifPort" value="85"></input>
		<div class="DivLable" style="float:left;margin-left:10px;">(1-65535)</div>	
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivLable txtNetWork" id="id_txtNetWorkRtspPort">Rtsp Port:</div>
		<input class="DivInput DivInputAtLoacalRecord" maxlength="5" id="id_NetWorkRtspPort" value="554"></input>
		<div class="DivLable" style="float:left;margin-left:10px;">(1-65535)</div>	
		<div style="clear:both;height:15px;"></div>
		
		<div class="DivButton" style="float:left;margin-left:300px;" id="id_submit">Save</div>
		<div style="clear:both"></div>
	</div>
</div>
</body> 

<script  type="text/javascript"> 
//语言包初始化
function InitLang(){
	SetLang('id_txtNetWorkMaxConnection',str_NetLink);
	SetLang('id_txtNetWorkDHCP',str_NetDHCP);
	SetLang('id_txtDisable',str_NetDHCPDisable);
	SetLang('id_txtEnable',str_NetDHCPEnable);
	SetLang('id_txtNetWorkIPV4Address',str_NetIpAddress);	
	SetLang('id_txtNetWorkIPV4Subnet',str_NetSubnet);
	SetLang('id_txtNetWorkIPV4Gateway',str_NetGetway);
	SetLang('id_txtNetWorkIPV4DNS1',str_NetMainDNS);
	SetLang('id_txtNetWorkIPV4DNS2',str_NetSubDns);
	SetLang('id_txtNetWorkIPV4MacAddr',str_NetMacAddr);
	SetLang('id_txtNetWorkIPV6Address',str_IPv6_Address);
	SetLang('id_txtNetWorkIPV6Gateway',str_IPv6_Gateway);
	SetLang('id_txtNetWorkIPV6DNS1',str_IPv6_NetMainDNS);
	SetLang('id_txtNetWorkIPV6DNS2',str_IPv6_NetSubDNS);
//	SetLang('id_txtNetWorkDatePort',str_NetImforport);
//	SetLang('id_txtNetWorkMediaPort',str_NetMediaPort);
	SetLang('id_txtNetWorkHttpPort',str_NethttpPort);
	SetLang('id_txtNetWorkOnvifPort',str_nOnvifPort);
	SetLang('id_txtNetWorkRtspPort',str_nRtspPort);
	SetLang('id_submit',str_Save);
};
</script> 

<script  type="text/javascript"> 
function InitPageParam()
{
	var resp = $.sendMsg("NetworkConfig",null,"/ISAPI/Network/NetworkConfig","POST");
	if(resp.success == false){
		alert("recv NetworkConfig  msg fail");
		return;
	}
	var map = resp.data;
	console.log( JSON.stringify(map));
	
	$("#id_MaxConnection")[0].value = map.netlink.maxlink;
	SetSelectionOptID('id_Dhcp',map.netlink.dhcp);
	$("#id_Ipv4Address")[0].value = map.netlink.ipv4.ipaddr;
	$("#id_Ipv4Subnet")[0].value = map.netlink.ipv4.subnetmask;
	$("#id_Ipv4Gateway")[0].value = map.netlink.ipv4.gateway;
	$("#id_Ipv4DNS1")[0].value = map.netlink.ipv4.dns1;
	$("#id_Ipv4DNS2")[0].value = map.netlink.ipv4.dns2;
	$("#id_Ipv4MacAddr")[0].value = map.netlink.macaddress;
	$("#id_Ipv6Address")[0].value = map.netlink.ipv6.ipaddr;
	$("#id_Ipv6Gateway")[0].value = map.netlink.ipv6.gateway;
	$("#id_Ipv6DNS1")[0].value = map.netlink.ipv6.dns1;
	$("#id_Ipv6DNS2")[0].value = map.netlink.ipv6.dns2;
	
	
	var resp = $.sendMsg("ThirdServer",null,"/ISAPI/Network/ExtServerParam","POST");
	if(resp.success == false){
		alert("recv ThirdServer msg fail");
		return;
	}
	var map = resp.data;
	$("#id_NetWorkHttpPort")[0].value = map.option_1.port;
	$("#id_NetWorkOnvifPort")[0].value = map.option_2.port;
	$("#id_NetWorkRtspPort")[0].value = map.option_3.port;
	//console.log( JSON.stringify(map));
}

function submit()
{	 
	var str_idDhcp;
	
	console.log('id_Dhcp ='+GetSelectionVal('id_Dhcp'));
	console.log('id_Dhcp ='+str_NetDHCPDisable);
	NetWorkHttpPort();
	NetWorkOnvifPort();
	NetWorkRtspPort();
	if(GetSelectionVal('id_Dhcp') == str_NetDHCPDisable){
		str_idDhcp = "0";
	}else{
		str_idDhcp = "1";
	}
	
	var Portmsg = [
					{"xtype":"option_1","items":
						[
							{"xtype":"servertype","text":"1"},
							{"xtype":"enabled","text":"1"},
							{"xtype":"port","text":$("#id_NetWorkHttpPort")[0].value}
						]
					},
					{"xtype":"option_2","items":
						[
							{"xtype":"servertype","text":"2"},
							{"xtype":"enabled","text":"1"},
							{"xtype":"port","text":$("#id_NetWorkOnvifPort")[0].value}
						]
					},
					{"xtype":"option_3","items":
						[
							{"xtype":"servertype","text":"3"},
							{"xtype":"enabled","text":"1"},
							{"xtype":"port","text":$("#id_NetWorkRtspPort")[0].value}
						]
					}
				];
	var respport = $.sendMsg("ThirdServer",Portmsg,"/ISAPI/Network/ExtServerParam","PUT");
	
	var msg = [
				{"xtype":"netlink","items":
					[
						{"xtype":"maxlink","text":$("#id_MaxConnection")[0].value},
						{"xtype":"dhcp","text":str_idDhcp},
						//{"xtype":"name","text":"Eth0"},
						{"xtype":"ipv4","items":
							[
								{"xtype":"ipaddr","text":$("#id_Ipv4Address")[0].value},
								{"xtype":"subnetmask","text":$("#id_Ipv4Subnet")[0].value},
								{"xtype":"gateway","text":$("#id_Ipv4Gateway")[0].value},
								{"xtype":"dns1","text":$("#id_Ipv4DNS1")[0].value},
								{"xtype":"dns2","text":$("#id_Ipv4DNS2")[0].value}
							]
						},
						{"xtype":"ipv6","items":
							[
								{"xtype":"ipaddr","text":$("#id_Ipv6Address")[0].value},
								//{"xtype":"ipv6prefixlength","text":"112"},
								{"xtype":"gateway","text":$("#id_Ipv6Gateway")[0].value},
								{"xtype":"dns1","text":$("#id_Ipv6DNS1")[0].value},
								{"xtype":"dns2","text":$("#id_Ipv6DNS2")[0].value}
							]
						},
						{"xtype":"macaddress","text":$("#id_Ipv4MacAddr")[0].value}
					]
				}
			];
	
	var resp = $.sendMsg("NetworkConfig",msg,"/ISAPI/Network/NetworkConfig","PUT");
	
	
	
	if(resp.success == false || respport.success == false){
		alert("submit submit msg fail");
	}else{
		alert(str_SetSuccess);
	}	
}


function NetWorkHttpPort()
{
	if($('#id_NetWorkHttpPort')[0].value < 1){
		$('#id_NetWorkHttpPort')[0].value = 80;
	}
	if($('#id_NetWorkHttpPort')[0].value > 65535){
		$('#id_NetWorkHttpPort')[0].value = 80;
	}
}

function NetWorkOnvifPort()
{
	if($('#id_NetWorkOnvifPort')[0].value < 1){
		$('#id_NetWorkOnvifPort')[0].value = 1;
	}
	if($('#id_NetWorkOnvifPort')[0].value > 85){
		$('#id_NetWorkOnvifPort')[0].value = 85;
	}
}

function NetWorkRtspPort()
{
	if($('#id_NetWorkRtspPort')[0].value < 1){
		$('#id_NetWorkRtspPort')[0].value = 1;
	}
	if($('#id_NetWorkRtspPort')[0].value > 554){
		$('#id_NetWorkRtspPort')[0].value = 554;
	}
}

$(function(){
	InitUdfSelect('id_Dhcp');
	InitLang();
	InitPageParam();
	BindEvent('id_submit','onmousedown',submit,null);
	BindEvent('id_NetWorkHttpPort','onchange',NetWorkHttpPort,null);
	BindEvent('id_NetWorkOnvifPort','onchange',NetWorkOnvifPort,null);
	BindEvent('id_NetWorkRtspPort','onchange',NetWorkRtspPort,null);
})
</script>   
</html>  